<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"
	language="java"%>
<%@ taglib prefix="s" uri="/struts-tags"%>

<form id="form">
	<input type="hidden" id="id" name="id"
		value='<s:property value="soccerService.id"/>' /> <input
		type="hidden" id="operation" name="operation"
		value='<s:property value="operation"/>'>

	<table id="ver-zebra">
		<colgroup>
			<col class="vzebra-odd" />
			<col class="vzebra-even" />
			<col class="vzebra-odd" />
			<col class="vzebra-even" />
		</colgroup>
		<tbody>

			<tr>
				<td><label>Tên dịch vụ: </label></td>
				<td><input id="name" type="text" required="required"
					name="name" /></td>
				<td><label>Giá tiền (VNĐ): </label></td>
				<td><input id="unitPrice" type="text" required="required"
					name="unitPrice" maxlength="10"/></td>
			</tr>

			<tr>
				<td></td>
				<td colspan="3"><s:if test="operation == 'add'">
						<input type="submit" value="Lưu lại" />
						<input type="button" value="Quay lại" onclick="goBack();" />
					</s:if> <s:if test="operation == 'update'">
						<input type="submit" value="Cập nhật" />
						<input type="button" value="Xóa" onclick="confirmToDelete();" />
					</s:if></td>
			</tr>

		</tbody>
	</table>
</form>

<script type="text/javascript">
	$(document).ready(
			function() {
				saveService();

				$("#unitPrice").keydown(
						function(e) {
							// Allow: backspace, delete, tab, escape, enter and .110 dau .
							if ($.inArray(e.keyCode, [ 46, 8, 9, 27, 13,
									190 ]) !== -1
									||
									// Allow: Ctrl+A
									(e.keyCode == 65 && e.ctrlKey === true) ||
									// Allow: home, end, left, right
									(e.keyCode >= 35 && e.keyCode <= 39)) {
								// let it happen, don't do anything
								return;
							}
							// Ensure that it is a number and stop the keypress
							if ((e.shiftKey || (e.keyCode<48 || e.keyCode>57))
									&& (e.keyCode<96 || e.keyCode>105)) {
								e.preventDefault();
							}
						});
			});

	function saveService() {
		$('#form').validate({
			submitHandler : function(form) {
				var datastr = $("#form").serialize();
				if ($('#operation').val() == 'update' && $('#id').val() == '') {
					showAlertDialog($('#form'));
				} else {
					$.ajax({
						type : "POST",
						url : 'saveService',
						data : datastr,
						cache : false,
						dataType : 'text',
						beforeSend : function() {
							$.blockUI({
								css : {
									border : 'none',
									padding : '15px',
									backgroundColor : '#000',
									'-webkit-border-radius' : '10px',
									'-moz-border-radius' : '10px',
									opacity : .5,
									color : '#fff'
								}
							});
						},
						complete : function() {
							$.unblockUI();
						},
						success : function(html) {
							goBack();
						},
						error : function(err) {
							$('#error_message').html("Thêm mới thất bại");
							$('#error_message').css("display", "block");
						}
					});
				}
			}
		});
	};

	function deleteService() {
		var id = $('#id').val();
		var datastr = 'id=' + id;
		$.ajax({
			type : "POST",
			url : "deleteService",
			data : datastr,
			cache : false,
			dataType : 'text',
			beforeSend : function() {
				$.blockUI({
					css : {
						border : 'none',
						padding : '15px',
						backgroundColor : '#000',
						'-webkit-border-radius' : '10px',
						'-moz-border-radius' : '10px',
						opacity : .5,
						color : '#fff'
					}
				});
			},
			complete : function() {
				$.unblockUI();
			},
			success : function(html) {
				goBack();
			},
			error : function(err) {
				$('#error_message').html("Không thể xóa vì đang được sử dụng");
				$('#error_message').css("display", "block");
			}
		});
	}

	function resetForm() {
		$('input[name="select"]').attr('checked', false);
		$('#error_message').css("display", "none");
		$('#id').val(null);
		$('#form').validate().resetForm();
		return false;
	}

	function confirmToDelete() {
		var id = $('#id').val();
		if (id == null || id == "") {
			showAlertDialog('#form');
		} else {
			// Define the Dialog and its properties.
			showConfirmDialog('#form');
		}

		return false;
	}

	function callback(value) {
		if (value) {
			deleteService();
		}
	}

	function goBack() {
		var url = 'listSoccerService';
		window.location.href = url;
	}

	function setService(id, name, unitPrice) {
		$('#id').val(id);
		$('#name').val(name);
		$('#unitPrice').val(unitPrice);

		return false;
	}
</script>
